<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">    
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>找到的内容</title>
<link rel="stylesheet" type="text/css" href="css/default.css">
<style type="text/css">
		#gallery-wrapper {
		position: relative;
		max-width: 90%;
		width: 88%;
		margin:20px auto;
		}
		img.thumb {
		width: 100%;
		max-width: 100%;
		height: 200px;
		}
		.white-panel {
		position: absolute;
		background: ghostwhite;
		border-radius: 15px;
		box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
		padding: 10px;
		}
		.white-panel h1 {
		font-size: 1em;
		}
		.white-panel h1 a {
		color: #A92733;
		}
		.white-panel:hover {
		box-shadow: 1px 1px 10px rgba(0,0,0,0.5);
		margin-top: -5px;
		-webkit-transition: all 0.3s ease-in-out;
		-moz-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
		}
		#show{
		color:skyblue;
		}
		#mes{
		color:red;
		}
		.font{
		width:60%;
		color:grey;
		}
		#tit{
		height:36px;
		color:black;
		}
		#bigbox{
		background-image: url("img/ybj.jpg");
		}
		#add{
		width:50%;
		color:black;
		}
		.al{
		width:20%;
		float:left;
		}
		#back{
	font-size: 20px;
	color: lightgreen;
	height: 36px;
	width:100px;
	border-radius:10px;
	position: relative;
	animation: colorswitch 20s infinite;
	/* Firefox */
	-moz-animation: colorswitch 20s infinite;
	/* Safari and Chrome */
	-webkit-animation: colorswitch 20s infinite;
	/* Opera */
	-o-animation: colorswitch 20s infinite;
	}
@keyframes colorswitch {
	0% {
		background: #0087C9
	}

	16% {
		background: #EF4A53
	}

	32% {
		background: #FFB463
	}

	49% {
		background: #33D5D4
	}

	65% {
		background: #254356
	}

	81% {
		background: #5B4097
	}

	100% {
		background: #0087C9
	}
}

/* Firefox */
@-moz-keyframes colorswitch {
	0% {
		background: #0087C9
	}

	16% {
		background: #EF4A53
	}

	32% {
		background: #FFB463
	}

	49% {
		background: #33D5D4
	}

	65% {
		background: #254356
	}

	81% {
		background: #5B4097
	}

	100% {
		background: #0087C9
	}
}

/* Safari and Chrome */
@-webkit-keyframes colorswitch {
	0% {
		background: #0087C9
	}
	16% {
		background: #EF4A53
	}

	32% {
		background: #FFB463
	}

	49% {
		background: #33D5D4
	}

	65% {
		background: #254356
	}

	81% {
		background: #5B4097
	}

	100% {
		background: #0087C9
	}
}

/* Opera */
@-o-keyframes colorswitch {
	0% {
		background: #0087C9
	}

	16% {
		background: #EF4A53
	}

	32% {
		background: #FFB463
	}

	49% {
		background: #33D5D4
	}

	65% {
		background: #254356
	}

	81% {
		background: #5B4097
	}

	100% {
		background: #0087C9
	}
}
#users{
width:30%;
color:black;
float:right;
margin-top:0px;
margin-right: 36%;
font-size: 18px;
}
	</style>
<!--[if IE]>
		<script src="http://libs.baidu.com/html5shiv/3.7/html5shiv.min.js"></script>
	<![endif]-->
</head>
<body id="bigbox">
<button id="back"> &lt; <span>返回</span> </button>
<div id="tit"><h3>&nbsp;<span th:text="${what}" id="check"></span><span th:text="${who}" id="show"></span>
<span th:text="${alert}" id="mes"></span>相关的内容</h3></div>
<div id="add"></div>
<section id="gallery-wrapper">
<article class="white-panel" th:each="coach:${coach}" id="coac">
<img src="James Corrot" class="thumb" th:src="${coach.user_headimg}">
<h1><a href="James Corrot" th:href="${lujin}" th:text="${coach.user_name}"></a></h1>
<div class="al">phone:</div><p th:text="${coach.user_phone}" class="font"></p>
<div class="al">昵称:</div><p th:text="${coach.user_nickname}" class="font"></p>
</article>
<article class="white-panel" th:each="coach:${venue}" id="ven">
<img src="James Corrot" class="thumb" th:src="${coach.img3}">
<h1><a href="James Corrot" th:href="${ven}" th:text="${coach.venue_name}"></a></h1>
<div class="al">场馆编号:</div><p th:text="${coach.venue_id}" class="font"></p>
<div class="al">场馆详情:</div><p th:text="${coach.venue_detail}" class="font"></p>
</article>
</section>
<script src="http://www.jq22.com/jquery/1.11.1/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/jquery.min.js"><\/script>')</script>
<script src="js/pinterest_grid.js"></script>
<script type="text/javascript">
		$(function(){
			var x=$("#show").html();
			var y=$("#check").html();
			$("#back").click(function(){
				location.href="/chat/main"; 
			});
			if(x=="场馆"){
				$("#coac").remove();
			}
			if(x=="学员"||x=="教练"){
				$("#ven").remove();
			}
			if(y=="没有找到与"){
				$("#add").append("&nbsp;&nbsp;&nbsp;&nbsp;为您推荐更多相关的:");
			}
			$("#gallery-wrapper").pinterest_grid({
				no_columns: 4,
                padding_x: 10,
                padding_y: 10,
                margin_bottom: 50,
                single_column_breakpoint: 700
			});
		});
	</script>
</body>
</html>